<!--
  This file is part of Moeditor.

  Copyright (c) 2016 Menci <huanghaorui301@gmail.com>
  Copyright (c) 2016 lucaschimweg
  Copyright (c) 2016 Wamadahama
  Copyright (c) 2016 tmr232

  Moeditor is free software: you can redistribute it and/or modify
  it under the terms of the GNU General Public License as published by
  the Free Software Foundation, either version 3 of the License, or
  (at your option) any later version.

  Moeditor is distributed in the hope that it will be useful,
  but WITHOUT ANY WARRANTY; without even the implied warranty of
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  GNU General Public License for more details.

  You should have received a copy of the GNU General Public License
  along with Moeditor. If not, see <http://www.gnu.org/licenses/>.
-->
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Moeditor</title>
        <base href="../href.html">

		<script>
		window.$ = window.jQuery = require('jquery');
        document.querySelector('html').classList.add(process.platform);
        </script>

        <link rel="stylesheet" href="../node_modules/font-awesome/css/font-awesome.min.css">

        <link rel="stylesheet" href="moe-scrollbar.css">
        <link rel="stylesheet" href="main/moe-popmenu.css">
        <link rel="stylesheet" href="main/moe-treeview.css">

        <script src="../node_modules/codemirror/lib/codemirror.js"></script>
        <script src="../node_modules/codemirror/mode/markdown/markdown.js"></script>
        <script src="../node_modules/codemirror/mode/gfm/gfm.js"></script>

        <script src="../node_modules/codemirror/addon/mode/simple.js"></script>
        <script src="../node_modules/codemirror/mode/xml/xml.js"></script>
        <script src="../node_modules/codemirror/mode/css/css.js"></script>
        <script src="../node_modules/codemirror/mode/clike/clike.js"></script>
        <script src="../node_modules/codemirror/mode/haml/haml.js"></script>
        <script src="../node_modules/codemirror/mode/htmlmixed/htmlmixed.js"></script>
        <script src="../node_modules/codemirror/mode/javascript/javascript.js"></script>
        <script src="../node_modules/codemirror/mode/jsx/jsx.js"></script>
        <script src="../node_modules/codemirror/mode/php/php.js"></script>
        <script src="../node_modules/codemirror/mode/python/python.js"></script>
        <script src="../node_modules/codemirror/mode/powershell/powershell.js"></script>
        <script src="../node_modules/codemirror/mode/ruby/ruby.js"></script>
        <script src="../node_modules/codemirror/mode/shell/shell.js"></script>
        <script src="../node_modules/codemirror/mode/slim/slim.js"></script>
        <script src="../node_modules/codemirror/mode/sql/sql.js"></script>
        <script src="../node_modules/codemirror/mode/stex/stex.js"></script>
        <script src="../node_modules/codemirror/mode/textile/textile.js"></script>
        <script src="../node_modules/codemirror/mode/verilog/verilog.js"></script>
        <script src="../node_modules/codemirror/mode/xml/xml.js"></script>
        <script src="../node_modules/codemirror/mode/xquery/xquery.js"></script>
        <script src="../node_modules/codemirror/mode/rust/rust.js"></script>
        <script src="../node_modules/codemirror/mode/mscgen/mscgen.js"></script>
        <script src="../node_modules/codemirror/mode/dylan/dylan.js"></script>
        <script src="../node_modules/codemirror/mode/meta.js"></script>

        <script src="../node_modules/codemirror/addon/mode/overlay.js"></script>
        <script src="../node_modules/codemirror/addon/mode/multiplex.js"></script>
        <script src="../node_modules/codemirror/addon/scroll/simplescrollbars.js"></script>
        <script src="../node_modules/codemirror/addon/selection/active-line.js"></script>
        <script src="main/CodeMirror/continuelist.js"></script>
        <script src="main/CodeMirror/markdown_math.js"></script>
        <script src="main/CodeMirror/gfm_math.js"></script>
        <link rel="stylesheet" href="../node_modules/codemirror/lib/codemirror.css">

        <script src="../node_modules/katex/dist/katex.min.js"></script>
        <link rel="stylesheet" href="../node_modules/katex/dist/katex.min.css">

        <script src="../node_modules/biu.js/dist/biu.min.js"></script>
        <link rel="stylesheet" href="../node_modules/biu.js/dist/biu.css">

        <!-- Mathjax config -->
        <script src="../node_modules/mathjax/MathJax.js?config=TeX-AMS-MML_SVG"></script>
        <script type="text/x-mathjax-config">
            MathJax.Hub.Config({
                tex2jax: {
                    preview: "none",
                    inlineMath: [ ['$','$'], ["\\(","\\)"] ],
                    processEscapes: true
                },
                messageStyle: "none"
            });
        </script>

        <script type="text/javascript" src="main/moe-document.js"></script>
        <script type="text/javascript" src="main/moe-sidemenu.js"></script>
        <!--script type="text/javascript" src="main/moe-treeview.js"></script-->
        <script type="text/javascript" src="main/moe-popmenu.js"></script>
        <script type="text/javascript" src="main/moe-mode.js"></script>
        <script type="text/javascript" src="main/moe-export.js"></script>
        <script type="text/javascript" src="main/moe-popmessage.js"></script>
        <script type="text/javascript" src="main/moe-watchfile.js"></script>
        <script type="text/javascript" src="main/moe-contextmenu.js"></script>

        <script type="text/javascript" src="moe-localize.js"></script>

        <link rel="stylesheet" href="fonts/moe-fonts.css">
        <link rel="stylesheet" href="main/moe-style.css">
        <link rel="stylesheet" href="main/base16-light.css">
    </head>
    <body>
        <div id="electron-titlebar" class="inset" style="z-index: 1; ">
            <div class="drag" id="drag-left"></div>
            <div class="drag" id="drag-right"></div>
        </div>
        <div id="side-menu">
            <div id="logo">MOEDITOR</div>
            <ul>
                <li data-action="new" class="l10n">New</li>
                <li data-action="open" class="l10n">Open</li>
                <li data-action="save" class="l10n">Save</li>
                <li data-action="save-as" class="l10n">Save as</li>
                <li class="break"></li>
                <li data-action="export-as-html" class="l10n">Export as HTML</li>
                <li data-action="export-as-pdf" class="l10n">Export as PDF</li>
                <li class="break"></li>
                <li data-action="settings" class="l10n">Settings</li>
                <li data-action="about" class="l10n">About</li>
            </ul>
        </div>
        <div id="file-tree" class="tree-view">
            <div class="tree-view-item tree-view-item-template">
                <div class="tree-view-thisitem">
                    <div class="tree-view-caret">
                        <i class="tree-view-caret-right fa fa-caret-right" aria-hidden="true"></i>
                        <i class="tree-view-caret-down fa fa-caret-down" aria-hidden="true"></i>
                    </div>
                    <div class="tree-view-icon">
                        <i class="tree-view-icon-dir fa fa-folder-o" aria-hidden="true"></i>
                        <i class="tree-view-icon-file fa fa-file-o" aria-hidden="true"></i>
                    </div>
                    <div class="tree-view-text">
                    </div>
                </div>
                <div class="tree-view-subitems">
                </div>
            </div>
            <div class="tree-view-items">
            </div>
        </div>
        <div id="main" class="notransition">
            <div id="side-menu-cover"></div>
            <div id="file-tree-cover"></div>
            <div id="main-container">
                <div id="left-panel">
                    <div id="editor">
                        <textarea></textarea>
                    </div>
                    <div class="cover-top"></div>
                </div>

                <div id="right-panel">
                    <div id="container-wrapper" tabindex="-1">
                        <div id="container" class="preview"></div>
                    </div>
                    <div class="cover-top"></div>
                </div>
            </div>
            <div id="cover-bottom">
                <div id="cover-bottom-background-left"></div>
                <div id="cover-bottom-background-right"></div>
                <div id="cover-bottom-left">
                    <div class="button-bottom l10n-title" id="button-bottom-menu" title="Menu">
                        <i class="fa fa-bars" aria-hidden="true"></i>
                    </div>
                    <!--div class="button-bottom l10n-title" id="button-bottom-file-tree" title="Directory">
                        <i class="fa fa-folder-o" aria-hidden="true"></i>
                    </div-->
                </div>
                <div id="cover-bottom-right">
                    <div class="button-bottom l10n-title" id="button-bottom-focus" title="Toggle focus mode">
                        <i class="fa fa-dot-circle-o" aria-hidden="true"></i>
                    </div>
                    <div class="button-bottom l10n-title" id="button-bottom-mode" title="Edit mode">
                        <i class="fa fa-eye" aria-hidden="true"></i>
                    </div>
                </div>
            </div>
        </div>
        <div id="popup-layer">
            <div class="popup-menu" id="popup-menu-mode" tabindex="-1">
                <ul>
                    <li data-name="write-wide"><i class="fa fa-check" aria-hidden="true"></i><span class="l10n">Write Mode</span> (<span class="l10n">Wide</span>)</li>
                    <li data-name="write-medium"><i class="fa fa-check" aria-hidden="true"></i><span class="l10n">Write Mode</span> (<span class="l10n">Medium</span>)</li>
                    <li data-name="write-narrow"><i class="fa fa-check" aria-hidden="true"></i><span class="l10n">Write Mode</span> (<span class="l10n">Narrow</span>)</li>
                    <li data-name="read-wide"><i class="fa fa-check" aria-hidden="true"></i><span class="l10n">Read Mode</span> (<span class="l10n">Wide</span>)</li>
                    <li data-name="read-medium"><i class="fa fa-check" aria-hidden="true"></i><span class="l10n">Read Mode</span> (<span class="l10n">Medium</span>)</li>
                    <li data-name="read-narrow"><i class="fa fa-check" aria-hidden="true"></i><span class="l10n">Read Mode</span> (<span class="l10n">Narrow</span>)</li>
                    <li data-name="preview"><i class="fa fa-check" aria-hidden="true"></i><span class="l10n">Preview Mode</span></li>
                </ul>
            </div>
        </div>
    </body>
</html>
